<template>
  <div class="footer">
    <div class="footer-container">
      <ul class="footerList">
        <li>
          <img src="./images/footer1.png" alt="" />
          <p>腾讯音乐娱乐集团</p>
        </li>
        <li>
          <img src="./images/footer2.png" alt="" />
          <p>腾讯音乐人</p>
        </li>
        <li>
          <img src="./images/footer3.png" alt="" />
          <p>酷狗音乐人</p>
        </li>
        <li>
          <img src="./images/footer4.png" alt="" />
          <p>星曜推歌</p>
        </li>
        <li>
          <img src="./images/footer5.png" alt="" />
          <p>5sing原创音乐</p>
        </li>
        <li>
          <img src="./images/footer6.png" alt="" />
          <p>曲库开放计划</p>
        </li>
        <li>
          <img src="./images/footer7.png" alt="" />
          <p>听歌识曲</p>
        </li>
        <li>
          <img src="./images/footer8.png" alt="" />
          <p>歌叽歌叽</p>
        </li>
      </ul>
      <ul class="about_kugou">
        <li>关于酷狗</li>
        <li>商务合作</li>
        <li>广告服务</li>
        <li>投诉指引</li>
        <li>隐私政策</li>
        <li>儿童隐私政策</li>
        <li>用户服务协议</li>
        <li>招聘信息</li>
        <li>客服中心</li>
        <li class="last">举报中心</li>
      </ul>
      <ul class="audio_visual">
        <li>粤网文（2022）1053-085号</li>
        <li>网络视听许可证 1910564号</li>
        <li>增值电信业务 粤B2-20060339</li>
        <li class="last">粤ICP备09017694号</li>
      </ul>
      <ul class="Service_License">
        <li>粤公网安备 44030002000001号</li>
        <li>互联网宗教信息服务许可证 粤（2022）0000022</li>
        <li class="last">营业执照</li>
      </ul>
      <ul class="Hotline">
        <li>互联网不良信息举报中心</li>
        <li>酷狗不良信息举报邮箱：jubao_music@kugou.net</li>
        <li>客服电话：020-29195668（7*24小时热线）</li>
      </ul>
      <ul class="Copyright">
        <li>Copyright © 2004-2022 KuGou-Inc.All Rights Reserved</li>
      </ul>
    </div>
  </div>
</template>

<script>
export default {
  name: "XFooter",
};
</script>

<style lang="less" scoped>
.footer-container {
  background: #2c323b;
  color: #b1b3b9;
  padding-bottom: 60px;
}
.footerList {
  display: flex;
  width: 100%;
  height: 188px;
  justify-content: center;
  align-items: center;
}

.footerList li {
  width: 96px;
  height: 86px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.footerList li img {
  width: 70px;
  height: 70px;
}

.about_kugou {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 16px;
}

.about_kugou li {
  padding: 0 6px;
  border-right: 1px solid #b1b3b9;
}

.audio_visual {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 16px;
}

.audio_visual li {
  padding: 0 6px;
  border-right: 1px solid #b1b3b9;
}

.Service_License {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 16px;
}

.Service_License li {
  padding: 0 6px;
  border-right: 1px solid #b1b3b9;
}

.Hotline {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 16px;
}

.Hotline li {
  padding: 0 6px;
}

.Copyright {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 16px;
}

.footer-container .last {
  border-right: none;
}
</style>
